<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="http://cdn.bootcss.com/bootstrap/3.2.0/css/bootstrap.min.css">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" type="text/css" href="gallery.css">
    <title>
      欢乐活动 · 首师附信技社
    </title>
    <!-- [if lt IE9]>
    <script type="text/javascript" src="html5shiv.min.js"></script>
    <![endif]-->
  </head>
  
  <body>
		<!-- 导航栏 -->
		<header>
			<nav class="navbar navbar-default navbar-fixed-top" role="navigation">
				<div class="container">
					<div class="navbar-header">
						<a class="navbar-brand"><span class="glyphicon glyphicon-plane"></span>首师附技术宅同好会</a>
					</div>

					<div class="collapse navbar-collapse">
						<ul class="nav navbar-nav">
							<li class="active"><a href="">同好会首页</a></li>
							<li><a href="forum.html">同好会论坛</a></li>
							<li class="dropdown">
								<a class="dropdown-toggle" data-toggle="dropdown" href="">各社团简介<span class="badge">6</span><span class="caret"></span></a>
								<ul class="dropdown-menu" role="menu">
									<li><a href="http://tieba.baidu.com/p/3213201445" target="_blank">V家同好社</a></li>
									<li><a href="http://tieba.baidu.com/p/3212784880#sub" target="_blank">信息技术社</a></li>
									<li><a href="http://tieba.baidu.com/p/3215472768?pid=55196440174&cid=0#55196440174" target="_blank">X-Ray演艺社</a></li>
									<li><a href="" target="_blank">VIVID微电影社</a></li>
									<li><a href="" target="_blank">Galaxy光影社</a></li>
									<li class="divider"></li>
									<li><a href="http://tieba.baidu.com/p/3217866917" target="_blank">同好会联合公告</a></li>
								</ul>
							</li>
							<li class="dropdown">
								<a class="dropdown-toggle" data-toggle="dropdown" href="">游戏区<span class="badge">4</span><span class="caret"></span></a>
								<ul class="dropdown-menu" role="menu">
									<li><a href="online-games/snake/snake.html" target="_blank">Snake Game</a></li>
									<li><a href="online-games/evil-bats/index.html" target="_blank">Evil Bats</a></li>
									<li><a href="online-games/bingo/bingo.html" target="_blank">bingo</a></li>
									<li><a href="100MB.test" target="_blank">100MB下载测速游戏</a></li>
								</ul>
							</li>
						</ul>

						<ul class="nav navbar-nav navbar-right">
							<li><a href="" data-toggle="modal" data-target="#contact">联系我们</a></li>
							<li><a href="" data-toggle="modal" data-target="#signin">登录</a></li>
							<li><a href="" data-toggle="modal" data-target="#register">新会员登记</a></li>
						</ul>
					</div>
				</div>
			</nav>
		</header>
    <!-- 主要部分 -->
    <hr>
    <main id="top">
	    	<div class="container">
		    <h1 class="title">
		      色员们的风采
		    </h1>
		    <p id="word">
		      拥有梦想的年华像握不住的沙，但你依然要去追逐
		    </p>
		   </div>
	    <!-- 图片展 -->
	    <article>
	    		<div class="container">
	    			<div class="row">
	    				<div class="col-md-5"><a href="gallery/(1).jpg" target="_blank" title="点击我查看大图OvO"><img src="gallery/(1).jpg" alt=""></a></div>
	    				<div class="col-md-7">
	    					<h4></h4>
	    					<p></p>
	    				</div>
	    			</div>
	    			<div class="row">
	    				<div class="col-md-7">
	    					<h4></h4>
	    					<p></p>
	    				</div>
	    				<div class="col-md-5"><a href="gallery/(1).png" target="_blank" title="点击我查看大图OvO"><img src="gallery/(1).png" alt=""></a></div>
	    			</div>
	    			<div class="row">
	    				<div class="col-md-5"><a href="gallery/(18).png" target="_blank" title="点击我查看大图OvO"><img src="gallery/(18).png" alt=""></a></div>
	    				<div class="col-md-7">
	    					<h4></h4>
	    					<p></p>
	    				</div>
	    			</div>
	    			<div class="row">
	    				<div class="col-md-7">
	    					<h4></h4>
	    					<p></p>
	    				</div>
	    				<div class="col-md-5"><a href="gallery/(2).png" target="_blank" title="点击我查看大图OvO"><img src="gallery/(2).png" alt=""></a></div>
	    			</div>
	    			<div class="row">
	    				<div class="col-md-5"><a href="gallery/(15).png" target="_blank" title="点击我查看大图OvO"><img src="gallery/(15).png" alt=""></a></div>
	    				<div class="col-md-7">
	    					<h4></h4>
	    					<p></p>
	    				</div>
	    			</div>
	    			<div class="row">
	    				<div class="col-md-7">
	    					<h4></h4>
	    					<p></p>
	    				</div>
	    				<div class="col-md-5"><a href="gallery/(3).png" target="_blank" title="点击我查看大图OvO"><img src="gallery/(3).png" alt=""></a></div>
	    			</div>
	    			<div class="row">
	    				<div class="col-md-5"><a href="gallery/(4).jpg" target="_blank" title="点击我查看大图OvO"><img src="gallery/(4).jpg" alt=""></a></div>
	    				<div class="col-md-7">
	    					<h4></h4>
	    					<p></p>
	    				</div>
	    			</div>
	    			<div class="row">
	    				<div class="col-md-7">
	    					<h4></h4>
	    					<p></p>
	    				</div>
	    				<div class="col-md-5"><a href="gallery/(4).png" target="_blank" title="点击我查看大图OvO"><img src="gallery/(4).png" alt=""></a></div>
	    			</div>
	    			<div class="row">
	    				<div class="col-md-5"><a href="gallery/(5).jpg" target="_blank" title="点击我查看大图OvO"><img src="gallery/(5).jpg" alt=""></a></div>
	    				<div class="col-md-7">
	    					<h4></h4>
	    					<p></p>
	    				</div>
	    			</div>
	    			<div class="row">
	    				<div class="col-md-7">
	    					<h4></h4>
	    					<p></p>
	    				</div>
	    				<div class="col-md-5"><a href="gallery/(5).png" target="_blank" title="点击我查看大图OvO"><img src="gallery/(5).png" alt=""></a></div>
	    			</div>
	    			<div class="row">
	    				<div class="col-md-5"><a href="gallery/(6).jpg" target="_blank" title="点击我查看大图OvO"><img src="gallery/(6).jpg" alt=""></a></div>
	    				<div class="col-md-7">
	    					<h4></h4>
	    					<p></p>
	    				</div>
	    			</div>
	    			<div class="row">
	    				<div class="col-md-7">
	    					<h4></h4>
	    					<p></p>
	    				</div>
	    				<div class="col-md-5"><a href="gallery/(6).png" target="_blank" title="点击我查看大图OvO"><img src="gallery/(6).png" alt=""></a></div>
	    			</div>
	    			<div class="row">
	    				<div class="col-md-5"><a href="gallery/(7).JPG" target="_blank" title="点击我查看大图OvO"><img src="gallery/(7).JPG" alt=""></a></div>
	    				<div class="col-md-7">
	    					<h4></h4>
	    					<p></p>
	    				</div>
	    			</div>
	    			<div class="row">
	    				<div class="col-md-7">
	    					<h4></h4>
	    					<p></p>
	    				</div>
	    				<div class="col-md-5"><a href="gallery/(7).png" target="_blank" title="点击我查看大图OvO"><img src="gallery/(7).png" alt=""></a></div>
	    			</div>
	    			<div class="row">
	    				<div class="col-md-5"><a href="gallery/(8).jpg" target="_blank" title="点击我查看大图OvO"><img src="gallery/(8).jpg" alt=""></a></div>
	    				<div class="col-md-7">
	    					<h4></h4>
	    					<p></p>
	    				</div>
	    			</div>
	    			<div class="row">
	    				<div class="col-md-7">
	    					<h4></h4>
	    					<p></p>
	    				</div>
	    				<div class="col-md-5"><a href="gallery/(8).png" target="_blank" title="点击我查看大图OvO"><img src="gallery/(8).png" alt=""></a></div>
	    			</div>
	    			<div class="row">
	    				<div class="col-md-5"><a href="gallery/(9).jpg" target="_blank" title="点击我查看大图OvO"><img src="gallery/(9).jpg" alt=""></a></div>
	    				<div class="col-md-7">
	    					<h4></h4>
	    					<p></p>
	    				</div>
	    			</div>
	    			<div class="row">
	    				<div class="col-md-7">
	    					<h4></h4>
	    					<p></p>
	    				</div>
	    				<div class="col-md-5"><a href="gallery/(9).png" target="_blank" title="点击我查看大图OvO"><img src="gallery/(9).png" alt=""></a></div>
	    			</div>
	    			<div class="row">
	    				<div class="col-md-5"><a href="gallery/(10).jpg" target="_blank" title="点击我查看大图OvO"><img src="gallery/(10).jpg" alt=""></a></div>
	    				<div class="col-md-7">
	    					<h4></h4>
	    					<p></p>
	    				</div>
	    			</div>
	    			<div class="row">
	    				<div class="col-md-7">
	    					<h4></h4>
	    					<p></p>
	    				</div>
	    				<div class="col-md-5"><a href="gallery/(10).png" target="_blank" title="点击我查看大图OvO"><img src="gallery/(10).png" alt=""></a></div>
	    			</div>
	    			<div class="row">
	    				<div class="col-md-5"><a href="gallery/(11).jpg" target="_blank" title="点击我查看大图OvO"><img src="gallery/(11).jpg" alt=""></a></div>
	    				<div class="col-md-7">
	    					<h4></h4>
	    					<p></p>
	    				</div>
	    			</div>
	    			<div class="row">
	    				<div class="col-md-7">
	    					<h4></h4>
	    					<p></p>
	    				</div>
	    				<div class="col-md-5"><a href="gallery/(11).png" target="_blank" title="点击我查看大图OvO"><img src="gallery/(11).png" alt=""></a></div>
	    			</div>
	    			<div class="row">
	    				<div class="col-md-5"><a href="gallery/(17).png" target="_blank" title="点击我查看大图OvO"><img src="gallery/(17).png" alt=""></a></div>
	    				<div class="col-md-7">
	    					<h4></h4>
	    					<p></p>
	    				</div>
	    			</div>
	    			<div class="row">
	    				<div class="col-md-7">
	    					<h4></h4>
	    					<p></p>
	    				</div>
	    				<div class="col-md-5"><a href="gallery/(12).png" target="_blank" title="点击我查看大图OvO"><img src="gallery/(12).png" alt=""></a></div>
	    			</div>
	    			<div class="row">
	    				<div class="col-md-5"><a href="gallery/(13).jpg" target="_blank" title="点击我查看大图OvO"><img src="gallery/(13).jpg" alt=""></a></div>
	    				<div class="col-md-7">
	    					<h4></h4>
	    					<p></p>
	    				</div>
	    			</div>
	    			<div class="row">
	    				<div class="col-md-7">
	    					<h4></h4>
	    					<p></p>
	    				</div>
	    				<div class="col-md-5"><a href="gallery/(13).png" target="_blank" title="点击我查看大图OvO"><img src="gallery/(13).png" alt=""></a></div>
	    			</div>
	    			<div class="row">
	    				<div class="col-md-5"><a href="gallery/(14).jpg" target="_blank" title="点击我查看大图OvO"><img src="gallery/(14).jpg" alt=""></a></div>
	    				<div class="col-md-7">
	    					<h4></h4>
	    					<p></p>
	    				</div>
	    			</div>
	    			<div class="row">
	    				<div class="col-md-7">
	    					<h4></h4>
	    					<p></p>
	    				</div>
	    				<div class="col-md-5"><a href="gallery/(14).png" target="_blank" title="点击我查看大图OvO"><img src="gallery/(14).png" alt=""></a></div>
	    			</div>
	    			<div class="row">
	    				<div class="col-md-5"><a href="gallery/(18).png" target="_blank" title="点击我查看大图OvO"><img src="gallery/(18).png" alt=""></a></div>
	    				<div class="col-md-7">
	    					<h4></h4>
	    					<p></p>
	    				</div>
	    			</div>
	    			<div class="row">
	    				<div class="col-md-7">
	    					<h4></h4>
	    					<p></p>
	    				</div>
	    				<div class="col-md-5"><a href="gallery/(15).png" target="_blank" title="点击我查看大图OvO"><img src="gallery/(15).png" alt=""></a></div>
	    			</div>
	    			<div class="row" id="bottom">
	    				<div class="col-md-5"><a href="gallery/(16).png" target="_blank" title="点击我查看大图OvO"><img src="gallery/(16).png" alt=""></a></div>
	    				<div class="col-md-7">
	    					<h4></h4>
	    					<p></p>
	    				</div>
	    			</div>
	    		</div>
	    </article>
	  </main>
	  <!-- 导航栏 -->
	  <footer>
		  	<nav class="navbar navbar-inverse navbar-fixed-bottom" role="navigation">
		  		<div class="container-fluid">
		  			<p class="navbar-text"><small>&copy; 2014 首师附信技社</small></p>
		  			<p class="navbar-text">作者：小黄鸡&trade;</p>
  					<ul class="nav navbar-nav navbar-right">
  						<li><a href="#top">返回顶部</a></li>
  						<li><a href="#bottom">走到底端</a></li>
  					</ul>
		  		</div>
		  	</nav>
	  </footer>
		<!-- 模态框组 -->
		<!-- 会员登记 -->
		<div class="modal fade" id="register" tabindex="-1" role="dialog" aria-labelledby="registerLabel" aria-hidden="true">
		  <div class="modal-dialog">
		    <div class="modal-content">
		      <div class="modal-header">
		        <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">关闭</span></button>
		        <h4 class="modal-title" id="registerLabel">新会员登记</h4>
		      </div>
		      <div class="modal-body">
		      <form class="form-register form-horizontal" role="form" id="registerForm">
      				<label for="name">姓名</label>
							<input class="form-control" type="text" name="name" placeholder="请输入姓名" maxlength="8" required id="name">

						<h3>性别</h3>
						<label class="radio-inline">
							<input type="radio" id="sex" name="sex" value="boy">正太（男孩纸）
						</label>
						<label class="radio-inline">
							<input type="radio" id="sex" name="sex" value="girl">萝莉（女孩纸）
						</label>
					
						<h3>年级&班级</h3>
						<select name="grade" id="grade">
							<option value="zm">中美（国际部）</option>
							<option value="pg">普高（高中部）</option>
							<option value="cz">初中（初中部）</option>
						</select>
						<select name="class" id="class">
							<option value="1">1班</option>
							<option value="2">2班</option>
							<option value="3">3班</option>
							<option value="4">4班</option>
							<option value="5">5班</option>
							<option value="6">6班</option>
							<option value="7">7班</option>
							<option value="8">8班</option>
							<option value="9">9班</option>
							<option value="10">10班</option>
							<option value="11">11班</option>
							<option value="12">12班</option>
						</select>
					
						<h3>什么时候有时间参加活动？</h3>
							<label class="checkbox-inline">
								<input type="checkbox" id="mon" name="mon" value="mon">星期一
							</label>
							<label class="checkbox-inline">
								<input type="checkbox" id="tue" name="tue" value="tue">星期二
							</label>
							<label class="checkbox-inline">
								<input type="checkbox" id="wed" name="wed" value="wed">星期三
							</label>
							<label class="checkbox-inline">
								<input type="checkbox" id="thu" name="thu" value="thu">星期四
							</label>
							<label class="checkbox-inline">
								<input type="checkbox" id="fri" name="fri" value="fri">星期五
							</label>
							<label class="checkbox-inline">
								<input type="checkbox" id="sat" name="sat" value="sat">星期六
							</label>
							<label class="checkbox-inline">
								<input type="checkbox" id="sun" name="sun" value="sun">星期日
							</label>
						
						<h3>兴趣OR专长</h3>
						<input class="form-control" type="text" id="interest" name="interest" placeholder="兴趣OR专长" required>

		      		</form>
		      </div>
		      <div class="modal-footer">
		        <button type="button" class="btn btn-primary" onclick="formSubmit('registerForm');">确认&登记 </button>
		      </div>
		    </div>
		  </div>
		</div>
		<!-- 联系我们 -->
		<div class="modal fade" id="contact" tabindex="-1" role="dialog" aria-labelledby="contactLabel" aria-hidden="true">
			<div class="modal-dialog">
				<div class="modal-content">
					<div class="modal-header">
	        		<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">关闭</span></button>
	        		<h4 class="modal-title" id="contactLabel">联系我们</h4>
					</div>
					<div class="modal-body">
						<p>搜索QQ群号：84398540</p><h2>首师附技术宅同好会</h2>
						<p>你也可以扫描二维码</p>
						<img src="images/1407505838882.png">
						<p>或点击链接</p>
						<a target="_blank" href="http://shang.qq.com/wpa/qunwpa?idkey=6b67dd13845ec3e94a646de1291719e057e9ffa8dec4c68fe21f729867bbfcbe"><img border="0" src="http://pub.idqqimg.com/wpa/images/group.png" alt="首师附技术宅同好会" title="首师附技术宅同好会"></a>
					</div>
					<div class="modal-footer">
						<button type="button" class="btn btn-primary" data-dismiss="modal">返回</button>
					</div>
				</div>
			</div>
		</div>
		<!-- 登录 -->
		<div class="modal fade" id="signin" tabindex="-1" role="dialog" aria-labelledby="signinLabel" aria-hidden="true">
			<div class="modal-dialog modal-sm">
				<div class="modal-content">
					<div class="modal-header">
						<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">关闭</span></button>
						<h4 class="modal-title" id="signinLabel">登录</h4>
					</div>
					<div class="modal-body">
			      <form class="form-register" role="form" id="signinForm">
			        <input type="text" class="form-control" placeholder="用户名" required autofocus id="signinText">
			        <input type="password" class="form-control" placeholder="密码" required>
			        <div class="checkbox">
			          <label>
			            <input type="checkbox" value="remember-me"> 记住我
			          </label>
			        </div>
			      </form>
			     </div>
			     <div class="modal-footer">	
			     	<button type="button" class="btn btn-primary" onclick="formSubmit('signinForm');">登录</button>
			     </div>
	      </div>
			</div>
    </div>
		<!-- jQuery库 -->
		<script type="text/javascript">
			backToTop();

			function backToTop() {
				scrollTo(0, 0);
			}
		</script>
		<script src="http://cdn.bootcss.com/jquery/2.1.1/jquery.min.js"></script>
		<!-- Bootstrap支持Javascript组件 -->
		<script src="http://cdn.bootcss.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
		<script>
			function formSubmit(formName) { document.getElementById(formName).submit(); }
		</script>
  </body>
 </html>